<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/style.css" rel="stylesheet" type="text/css" />
<!-- Import The jQuery Script --> 
<script src="js/jquery.js" type="text/javascript"></script>
<link rel="shortcut icon" href="favicon.ico" />
<title>Home page</title>
</head>
<body>
<!-- begin: #Page -->
<div id="page">
    <div class="page">
        <div class="col1">
            <div class="col1_in">
                <div class="box_menu">
                    <div class="top_menu">&nbsp;</div>
                    <div id="menu">
                        <ul>
                            <li><a href="index.html">Home</a></li>
                            <li><a href="history.html">History</a></li>
                            <li><a href="education.html">Education</a></li>
                            <li class="active"><a href="work.html">Work Groups&nbsp;&nbsp;&nbsp;<img style="vertical-align: middle;" src="img/icon_menu_01.jpg" /></a>
                            
                                <ul>
                                    <li><a href="#"><img style="vertical-align: middle;" src="img/icon_menu_02.jpg" />&nbsp;&nbsp;History</a></li>
                                    <li><a href="#"><img style="vertical-align: middle;" src="img/icon_menu_02.jpg" />&nbsp;&nbsp;History</a></li>
                                    <li><a href="#"><img style="vertical-align: middle;" src="img/icon_menu_02.jpg" />&nbsp;&nbsp;History</a></li>
                                </ul>
                            
                            </li>
                            <li><a href="facilities.html">Facilities</a></li>
                            <li><a href="events.html">Events</a></li>
                            <li><a href="about.html">About</a></li>
                            <li>
                                <a class="icon" href="#"><img src="img/icon_t.jpg" /></a><a class="icon" href="#"><img src="img/icon_r.jpg" /></a>
                                <a class="icon" href="#"><img src="img/icon_f.jpg" /></a><a class="icon" href="#"><img src="img/icon_o.jpg" /></a>
                                <div class="clear_left"></div>
                            </li>
                            
                        </ul>
                    
                    </div>
                </div>
                <div class="box_menu_bottom">&nbsp;</div>
            </div>
        </div>
        
        <div class="col2">
            <div class="header">
                <div class="header1"><div class="logo"><a href="index.html"><img src="img/logo.png" /></a></div></div>
                <div class="header2">
                    <div class="search">
                        <div class="header_text">contact | 1300 90 51 80</div>
                        <div class="input_search">
                        <input class="text_search" type="text" name="search" value="Search" />
                        <input class="img_seach" type="image" name="send" src="img/bt_search.jpg" />
                        
                        </div>
                        <div class="clear_left"></div>
                        <div class="p10t p10r float_right">
                            <a href="#"><img src="img/gb.png" /></a>
                            <a href="#"><img src="img/tr.png" /></a>
                        </div>
                    </div>
                
                </div>
                <div class="clear_left"></div>
            </div>
            
            <div class="temp1"></div>
            <script>
                function show_(id){
                    for(i=1; i<4;i++){
                        if(i==id){
                            jQuery('#banner_home_'+i).fadeIn('slow');
                            jQuery("#box_tip_home_"+i).addClass('active');
                        }
                        else{
                            document.getElementById('banner_home_'+i).style.display = "none";
                            jQuery("#box_tip_home_"+i).removeClass('active');
                        }
                    }
                }
                </script>
            <div class="intro_home">
                
                <div id="banner_home_1" style="display: block; width: 700px;height: 243px; background: url(img/banner_home.jpg) no-repeat;z-index:1;"></div>
                
                <div id="banner_home_2" style="display: none; width: 700px;height: 243px; background: url(img/banner_home.jpg) no-repeat;z-index:1;"></div>
                <div id="banner_home_3" style="display: none; width: 700px;height: 243px; background: url(img/banner_home.jpg) no-repeat;z-index:1;"></div>
                
                <div class="box_tip_home" style="position: relative;">
                    <div id="box_tip_home_1" class="box_tip_home_1" style="cursor: pointer;" onclick="show_(1);">
                        <div class="box_tip_home_text_1">
                            <div class="f16px">Our History</div>
                            <div>Read about the Western Thrace history</div>
                        </div>
                    </div>
                    <div id="box_tip_home_2" class="box_tip_home_2" style="cursor: pointer;" onclick="show_(2);">
                        <div class="box_tip_home_text_2">
                            <div class="f16px">Our History</div>
                            <div>Read about the Western Thrace history</div>
                        </div>
                    </div>
                    <div id="box_tip_home_3" class="box_tip_home_3" style="cursor: pointer;" onclick="show_(3);">
                        <div class="box_tip_home_text_3">
                            <div class="f16px">Our History</div>
                            <div>Read about the Western Thrace history</div>
                        </div>
                    </div>
                    <div class="clear_left"></div>
                </div>
                
            </div>
            
            <div class="content">
               
                <div class="text_home">
                    <div class="text_home1">
                        <div class="p10r">
                         <div class="title_home">
                            Title Goes Here
                        </div>
                        <div class="title">Lorem Ipsum is simply dummy text of the printing and industry. Lorem Ipsum has </div>
                        <div class="p15t">
                      
                        dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.Lorem Ipsum is simply dummy text of the
                        
                        <br /><br />
                        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting.

                        </div>
                        </div>
                    </div>
                    <div class="text_home2">
                        <div class="title_home_1">
                            Shortcuts
                        </div>
                        <div class="box_home">
                            <div class="p15t"><img src="img/icon_01.png" />&nbsp;<a href="#">asd  as d sd sa d sads dasd sa ds ad sdsa sa d asd s dsa </a></div>
                            <div class="p15t"><img src="img/icon_01.png" />&nbsp;<a href="#">asd  as d sd sa d sads dasd sa ds ad sdsa sa d asd s dsa </a></div>
                            
                            <div class="p15t"><img src="img/icon_01.png" />&nbsp;<a href="#">asd  as d sd sa d sads dasd sa ds ad sdsa sa d asd s dsa </a></div>
                            <div class="p15t"><img src="img/icon_01.png" />&nbsp;<a href="#">asd  as d sd sa d sads dasd sa ds ad sdsa sa d asd s dsa </a></div>
                            
                        </div>
                    </div>
                    <div class="clear_left"></div>
                </div>
                
                <div class="news_home">
                    <div class="news_home1">
                        <div class="article">
                            <div>
                                <div class="date">
                                    <div class="date_text1">NAV</div>
                                    <div class="date_text2">26</div>
                                </div>
                                <div class="aricle_title">News Article 01</div>
                                <div class="clear_left"></div>
                            </div>
                            <div class="article_text">
                                <img src="img/img_02.jpg" style="float:left; margin: 0 10px 10px 0;"/>
                                <p> dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. 
                                It has survived not only five centuries, but also the leap into electronic typesetting
                                </p>
                                <div class="clear-left"></div>
                            </div>
                            <div class="readmore">
                                <a href="#">read more</a>
                            </div>
                            <div class="clear"></div>
                        </div>
                        <div class="article">
                            <div>
                                <div class="date">
                                    <div class="date_text1">NAV</div>
                                    <div class="date_text2">26</div>
                                </div>
                                <div class="aricle_title">News Article 01</div>
                                <div class="clear_left"></div>
                            </div>
                            <div class="article_text">
                                <img src="img/img_02.jpg" style="float:left; margin: 0 10px 10px 0;"/>
                                <p> dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. 
                                It has survived not only five centuries, but also the leap into electronic typesetting
                                </p>
                                <div class="clear-left"></div>
                            </div>
                            <div class="readmore">
                                <a href="#">read more</a>
                            </div>
                            <div class="clear"></div>
                        </div>
                    </div>
                    <div class="news_home2">
                        <div class="news_letter">
                            <div class="news_letter_content">
                                <div class="news_title">News Letter</div>
                                <div class="p15t from_newsletter">
                                    <div class="p10b">
                                        <p>It has survived not only five centuries, but also the leap into</p>
                                    </div>
                                    <label>name</label><br />
                                    <input type="text" name="name"/><br />
                                    <label>email</label><br />
                                    <input type="text" name="email"/><br />
                                </div>
                                <div class="p15t" style="float: right;"><input type="image" src="img/bt_submit.jpg" name="send"/></div>
                            </div>
                        </div>
                          
                    </div>
                    <div class="clear_left"></div>
                </div>
                
                <!--BOX FOOTER--->
                <div class="box_footer">
                    <div class="box_footer_content">
                        <div class="logo_1"><img src="img/logo_1.png" /></div>
                        <div class="menu_footer">
                            <ul>
                                <li><a href="#">Home</a></li>
                                <li><a href="#">Home</a></li>
                                <li><a href="#">Home</a></li>
                                <li><a href="#">Home</a></li>
                                <li><a href="#">Home</a></li>
                                <li><a href="#">Home</a></li>
                                <li><a href="#">Home</a></li>
                                <li><a href="#">Home</a></li>
                                <li><a href="#">Home</a></li>
                                <li><a href="#">Home</a></li>
                                <li><a href="#">Home</a></li>
                                <li><a href="#">Home</a></li>
                            </ul>
                        </div>
                        <div class="box_contact">
                            <div class="box_contact_text">
                                <p>contact details:</p>
                                <p>1300 90 51 80 Level 10, 50 </p>
                                <p>Market St  Melbourne 3000</p>
                            </div>
                        </div>
                        <div class="clear"></div>
                    </div>
                </div>
                <!--END BOX---> 
            </div>
            
        </div>
        <!--End col2--->
        <div class="clear"></div> 
    </div>


    <!-- begin: #Footer -->
    <div id="footer">
       
    </div>
    <!-- end: #Footer -->

</div>
<!-- end: #Page -->
</body>
</html>